// 引入当前文件 对应的 less
require("../less/personal.less");


// 页面加载完毕
document.ready(() => {
    //获取dom
    let showSexPicker = document.querySelector("#showSexPicker");
    let sex = document.querySelector("#sex");
    //生日
    let showBirthdayPicker = document.querySelector("#showBirthdayPicker");
    let birthday = document.querySelector("#birthday");
    //省
    let showProvincePicker = document.querySelector("#showProvincePicker");
    let province = document.querySelector("#province");
    //城市 
    let showCityPicker = document.querySelector("#showCityPicker");
    let city = document.querySelector("#city");
    //签名
    let signArea = document.querySelector("#signArea");
    let signNum = document.querySelector("#signNum");
    //返回按钮
    let backBtn = document.querySelector("#backBtn");
    //昵称
    let nickName = document.querySelector("#nickName");
    //保存按
    let saveBtn = document.querySelector("#saveBtn");

    // 省份的数组
    let provinceArr = [
        // {
        //     label: '四川省',
        //     value: 0
        // },
        // {
        //     label: '广东省',
        //     value: 1
        // },
        // {
        //     label: '湖北省',
        //     value: 0
        // },
        // {
        //     label: '河南省',
        //     value: 1
        // }
    ]
    //城市的数组
    let cityArr = [
        {
            label: '',
            // value: 0
        },
        // {
        //     label: '绵阳市',
        //     value: 1
        // },
        // {
        //     label: '南充市',
        //     value: 2
        // },
    ]
    /* 性别选择 */
    showSexPicker.addEventListener('click', function () {
        weui.picker(
            [
                {
                    label: '男',
                    value: 0
                },
                {
                    label: '女',
                    value: 1
                }
            ],
            {
                //按确定按钮时触发
                onConfirm: function (result) {
                    console.log(result[0].label);
                    sex.textContent = result[0].label
                },
                title: '请选择性别'
            }
        );
    });
    /* 生日选择 */
    showBirthdayPicker.addEventListener('click', function () {
        weui.datePicker({
            start: 1990,
            end: new Date().getFullYear(),

            onConfirm: function (result) {
                console.log(result);//[{年}，{月}，{日}]
                /* let arr = result.map(function (v) {
                    return window.$utils.padZero(v.value);
                })
                birthday.textContent = arr.join("-"); */
                birthday.textContent = result.map(function (v) {
                    return window.$utils.padZero(v.value);
                }).join("-")
            },
            title: '请选择日期'
        });
    });
    /* 省份 */
    showProvincePicker.addEventListener('click', function () {
        weui.picker(
            provinceArr,
            {
                //按确定按钮时触发
                onConfirm: function (result) {
                    console.log(result);
                    // console.log(result[0].label);
                    province.textContent = result[0].label

                    /* 发请求去获取当前省份所管辖的城市 */
                    axios.get(window.$utils.BASE_URL + "/address/city/" + result[0].value)
                        .then((res) => {
                            let result = res.data;
                            console.log(result);
                            if (result.status === 0) {
                                // 组织城市数据
                                cityArr = result.data.map(function (v) {
                                    let obj = {
                                        label: v.name,
                                        value: v.addressId
                                    };
                                    return obj;
                                })
                            }
                        })
                        .catch((error) => {
                            console.log(error);
                        })
                },
                title: '请选择省份'
            }
        );
    });
    /* 页面加载时就发请求去获取省份信息 */
    getProvince();
    function getProvince() {
        axios.get(window.$utils.BASE_URL + "/address/province")
            .then((res) => {
                let result = res.data;
                if (result.status === 0) {
                    //为省份组织数据
                    provinceArr = result.data.map(function (v) {
                        /*  let obj = {
                             label: v.name,
                             value: v.addressId
                         }
                         return obj */
                        return {
                            label: v.name,
                            value: v.addressId
                        }
                    })
                }
                console.log(result.data);
            })
            .catch((error) => {
                console.log(error);
            })
    }

    /* 城市 */
    showCityPicker.addEventListener('click', function () {
        weui.picker(
            cityArr,
            {
                //按确定按钮时触发
                onConfirm: function (result) {
                    console.log(result[0].label);
                    city.textContent = result[0].label
                },
                title: '请选择城市'
            }
        );
    });
    /* 签名的输入事件 */
    signArea.addEventListener("input", function () {
        console.log(this.value);
        signNum.textContent = this.value.length;
    })

    /* 返回按钮的事件 */
    backBtn.addEventListener("click", function () {
        // alert(111)
        window.history.go(-1);
    })
    let userId = "";
    /* 渲染数据  
       从本地存储中获取数据进行显示，数据回显。
    */
    render()
    function render() {
        // console.log("渲染数据 ");
        let user = JSON.parse(window.localStorage.getItem("user"));
        userId = user.userId;
        nickName.value = user.nickname;//昵称
        sex.textContent = user.gender ? user.gender : "请选择" //性别

        birthday.textContent = user.birthday ? window.$utils.formatDate(user.birthday) : "请选择";//生日
        province.textContent = user.address ? user.address.split(",")[0] : "请选择"; //省份
        city.textContent = user.address ? user.address.split(",")[1] : "请选择"; // 城市 
        signArea.value = user.sign;  //签名
        signNum.textContent = user.sign ? user.sign.length : "0";


    }
    //保存按钮
    saveBtn.addEventListener("click", function () {
        // alert(666)
        axios.post(window.$utils.BASE_URL + "/users/userEdit",
            {
                "nickname": nickName.value,
                "gender": sex.textContent,
                "birthday": birthday.textContent,
                "address": [province.textContent, city.textContent],
                "sign": signArea.value,
                "userId": userId,
            }
        )
            .then((res) => {
                let rst = res.data;
                if (rst.status === 0) {
                    //保存成功
                    window.setTimeout(() => {
                     window.$utils.showToast("zp-good", "保存成功")
                     window.location.href = "../mine.html";
                    }, 3000); 
                } else if (rst.status === 1) {
                    //保存失败
                    window.$utils.showToast("zp-close", "保存失败")
                }
            })
            .catch((error) => {
                console.log(error);
            })
    })
    // http://139.9.177.51:8099/users/userEdit
})